<?php
require 'inc_security.php';
define('DOMAIN', 'http://'.$_SERVER['HTTP_HOST']);
$id_field = 'imu_id';
$myform = new generate_form();
$action = getValue('action','str','POST','');
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="vi" lang="vi" xmlns:og="http://ogp.me/ns#" xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<?=$load_header?>

<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/smoothness/jquery-ui.min.css" media="screen" />
<link type="text/css" rel="stylesheet" href="http://www.plupload.com/plupload/js/jquery.ui.plupload/css/jquery.ui.plupload.css" media="screen" />
    
<script type="text/javascript" src="../../resources/js/plupload/plupload.full.min.js" charset="UTF-8"></script>
<script type="text/javascript" src="../../resources/js/plupload/jquery-ui.min.js" charset="UTF-8"></script>
<script type="text/javascript" src="../../resources/js/plupload/jquery.ui.plupload/jquery.ui.plupload.min.js" charset="UTF-8"></script>
<script type="text/javascript" src="../../resources/js/plupload/themeswitcher.js" charset="UTF-8"></script>
<style>
#uploader{
   margin-bottom:20px
}
.grid_header{
   display:none
}
</style>
</head>
<body>
<div class="module_header bold fix"><?=$module_name?></div>
<div id="wrapper">
<div id="uploader">
    <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
</div>
 
<script type="text/javascript">
// Initialize the widget when the DOM is ready
$(function() {
    $("#uploader").plupload({
        // General settings
        runtimes : 'html5,flash,silverlight,html4',
        url : "images_upload.php",
 
        // Maximum file size
        max_file_size : '2mb',
 
        chunk_size: '1mb',
 
        // Resize images on clientside if we can

 
        // Specify what files to browse for
        filters : [
            {title : "Image files", extensions : "jpg,gif,png,jpeg"}
        ],
 
        // Rename files by clicking on their titles
        rename: true,
         
        // Sort files
        sortable: true,
 
        // Enable ability to drag'n'drop files onto the widget (currently only HTML5 supports that)
        dragdrop: true,
 
        // Views to activate
        views: {
            list: true,
            thumbs: true, // Show thumbs
            active: 'thumbs'
        },
 
        // Flash settings
        flash_swf_url : '../../resources/js/plupload/Moxie.swf',
     
        // Silverlight settings
        silverlight_xap_url : '../../resources/js/plupload/Moxie.xap',
         preinit: {
                    Init: function (up, info) {
                        //log('[Init]', 'Info:', info, 'Features:', up.features);
                    },
 
                    UploadFile: function (up, file) {
                        //log('[UploadFile]', file);
                    },
 
                    UploadComplete: function (up, file) {
                        //plupload_add
                        window.location.href='m8_upload.php';
                    },
 
                    UploadProgress: function (up,file) {
                    },
 
                    PostInit: function (up) {
 
                    },
 
                    QueueChanged: function (up) {
                    }
                }
    });

	// Client side form validation
	$('form').submit(function(e) {
	  
        var uploader = $('#uploader').plupload('getUploader');

        // Files in queue upload them first
        if (uploader.files.length > 0) {
            // When all files are uploaded submit form
            uploader.bind('StateChanged', function() {
                if (uploader.files.length === (uploader.total.uploaded + uploader.total.failed)) {
                    $('form')[0].submit();
                }
            });
                
            uploader.start();
            
                        
        } else
            //alert('You must at least upload one file.');
         //dung trong trường bắt buộc upload ảnh
        //return false;
        return true;
        
    });
});
</script>
<?
   $list = new dataGrid('imu_id',30);
   $list->add('imu_image','Ảnh','string',0,0, 'width="120px"');
   $list->add('imu_image_alt','ALT(gõ và enter để lưu lại)','string',0,0, 'width="120px"');
   $list->add('imu_image','Chèn ảnh','string',0,0, 'width="120px"');
   $list->add('','Delete','delete');
   $db_count = new db_count('SELECT count(*) as count 
                               FROM images_upload
                               WHERE 1 '.$list->sqlSearch().' AND imu_module ="'.$bg_table.'"
                               ');
   $total = $db_count->total;unset($db_count);
   
   $db_listing = new db_query('SELECT * 
                               FROM images_upload
                               WHERE 1 '.$list->sqlSearch().' AND imu_module ="'.$bg_table.'"
                               ORDER BY '.$list->sqlSort().' imu_id DESC 
                               '.$list->limit($total));
   $total_row = mysql_num_rows($db_listing->result);
?>
   
   <?=$list->showHeader1($total_row)?>
   <?php
   $i = 0; 
   ?>
   <?php while($row = mysql_fetch_assoc($db_listing->result)){
     $i++;
   ?>
   <?=$list->start_tr($i,$row[$id_field])?>
   <td class="center">
     <div class="img_thumb">
         <img src="<?=$bg_filepath?><?=$row['imu_image']?>" alt="Không có ảnh"/>
     </div>
   
   </td>
   <td class="center">
     <input type="text" name="imu_image_alt" value="<?=$row['imu_image_alt']?>" class="span3 imu_image_alt imu_image_alt<?=$row['imu_id']?>" imu_id="<?=$row['imu_id']?>" style="float: left;margin-right:5px"/>
     <div class="status_img<?=$row['imu_id']?>" style="float: left;width: 22px;height: 22px;"></div>   
   </td>
   <td>
      <a href="javscript:;" class='1' onclick="insert_images(<?=$row['imu_id']?>,'<?=$domain.'/pictures/'.$bg_table.'/'.$row['imu_image']?>');">Chèn ảnh</a>
   </td>
   
   <?=$list->showDeleteImage($row[$id_field])?>
   <?=$list->end_tr()?>
   <?}?>
   <?=$list->showFooterImages()?>
</div>
<script>
   function insert_images(obj,path_image){
      var image_alt = $('.imu_image_alt'+obj).val();
      var img = '<img src="'+path_image+'" title="'+image_alt+'" alt = "'+image_alt+'" style="max-width:100%;" />';
      window.parent.tinyMCE.execCommand("mceInsertContent",false,img);
   }
   $('.imu_image_alt').keypress(function(event){
      if(event.keyCode == 13){
         var image_alt = $(this).val();
         var imu_id = $(this).attr('imu_id');
         $('.status_img'+imu_id).html('<img src="../../resources/img/loading.gif"/>');
         $.post('ajax.php',{'action':'update_image_alt','imu_id':imu_id,'image_alt':image_alt},function(data){
            if(data['success'] == 1){            
               $('.status_img'+imu_id).html('<img src="../../resources/img/tick.ico"/>');
            }
         },'json')
      }
   })
</script>